<template>
  <view class="ticket-apply-table-wrap">
    <le-moveable v-if="scale > 0" :scale="scale">
      <view class="ticket-apply-table" :style="{ width: `${clientWidth}px` }">
        <view>
          <view class="ticket-title">{{ workTypeLabel }}</view>
          <view class="ticket-code">编号：{{ ticket.ticketCode }}</view>
        </view>
        <component
          v-bind:is="currentTicketComponent"
          :ticket-id="ticketId"
          :detail="detail"
          :inspect="inspect"
          :ticket="ticket"
          :signatures="signatures"
          :actual-date-label="actualDateLabel"
          :relevanceTicketLabel="relevanceTicketLabel"
          :riskIdentificationResult="riskIdentificationResult"
        />
        <examine-table
          :ticket-content="detail"
          :inspect="inspect"
          :ticket="ticket"
          :cancel-info="cancelInfo"
          :signatures="signatures"
        />
      </view>
    </le-moveable>
  </view>
</template>
<script>
import FireTicketTable from './FireTicketTable.vue'
import HighTicketTable from './HighTicketTable.vue'
import LiftingTicketTable from './LiftingTicketTable.vue'
import ExamineTable from './ExamineTable.vue'
import ElectricTicketTable from './ElectricTicketTable.vue'
import BlindPlateTicketTable from './BlindPlateTicketTable.vue'
import BreakGroundTicketTable from './BreakGroundTicketTable.vue'
import BreakerTicketTable from './BreakerTicketTable.vue'
import LimitSpaceTicketTable from './LimitSpaceTicketTable.vue'
import DeviceOverhaulTable from './DeviceOverhaulTable.vue'
import LeMoveable from './le-movable.vue'
import dayjs from 'dayjs'
import { specialWorkTypeEnum } from '@/utils/constant'
export default {
  components: {
    ExamineTable,
    FireTicketTable,
    HighTicketTable,
    LiftingTicketTable,
    ElectricTicketTable,
    BreakGroundTicketTable,
    BlindPlateTicketTable,
    BreakerTicketTable,
    DeviceOverhaulTable,
    LimitSpaceTicketTable,
    LeMoveable
  },
  props: {
    ticketId: [Number, String],
    detail: {
      type: Object,
      default: () => ({})
    },
    inspect: {
      type: Object,
      default: () => ({})
    },
    signatures: {
      type: Array,
      default: () => []
    },
    cancelInfo: {
      type: Array,
      default: () => []
    },
    ticket: {
      type: Object,
      default: () => ({})
    },
    relevanceTicketLabel: String,
    riskIdentificationResult: String
  },
  data() {
    return {
      scale: 0,
      clientWidth: 1000,
      comps: {
        FIRE: { name: '动火', componentName: 'FireTicketTable' },
        ELEVATION: { name: '高处作业', componentName: 'HighTicketTable' },
        HOISTING: { name: '吊装', componentName: 'LiftingTicketTable' },
        TEMP_ELECTRICITY: { name: '临时用电', componentName: 'ElectricTicketTable' },
        BLIND_PLATE_PLUGGING: { name: '盲板抽堵', componentName: 'BlindPlateTicketTable' },
        BREAK_GROUND: { name: '动土', componentName: 'BreakGroundTicketTable' },
        OPEN_CIRCUIT_SAFETY: { name: '断路', componentName: 'BreakerTicketTable' },
        EQUIPMENT_SAFETY: { name: '设备检修', componentName: 'DeviceOverhaulTable' },
        CONFINED_SPACE: { name: '受限空间', componentName: 'LimitSpaceTicketTable' }
      }
    }
  },
  computed: {
    currentTicketComponent() {
      return this.comps[this.ticket.workTypeFlag].componentName
    },
    // 作业实施时间
    actualDateLabel() {
      if (!this.ticket || !this.ticket.actualStartTime) {
        return '作业未开始'
      }
      const start = dayjs(this.ticket.actualStartTime).format('YYYY 年 MM 月 DD 日 HH 时 mm 分')
      if (!this.ticket.actualEndTime) {
        return `自 ${start} 至 未结束`
      }
      const end = dayjs(this.ticket.actualEndTime).format('YYYY 年 MM 月 DD 日 HH 时 mm 分')
      return `自 ${start} 至 ${end}`
    },
    workTypeLabel() {
      if (!this.ticket) {
        return ''
      }
      let { workTypeLabel: label, ticketWorkLevelLabel, ticketWorkLevel, workTypeFlag } = this.ticket
      if (label.substring(label.length - 1, label.length) !== '票') {
        label = label + '票'
      }
      const highLevelEnum = {
        1: '一级',
        2: '二级',
        3: '三级',
        4: '四级'
      }
      switch (workTypeFlag) {
        case specialWorkTypeEnum.HIGH:
          ticketWorkLevelLabel = highLevelEnum[ticketWorkLevel]
          break
        default:
          break
      }

      return ticketWorkLevelLabel ? ticketWorkLevelLabel + label : label
    }
  },
  mounted() {
    uni.getSystemInfo({
      success: (e) => {
        this.scale = e.windowWidth / this.clientWidth
      }
    })
  }
}
</script>
<style scoped lang="scss">
@import './style.scss';
.ticket-title {
  margin-top: 6px;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
  margin-bottom: 4px;
}
.ticket-code {
  font-size: 14px;
  text-align: right;
  margin-bottom: 10px;
  margin-right: 12px;
}
</style>
